<template>
  <div>
    <ep-button @click="closeAll">关闭所有</ep-button>
    <ep-button @click="handleAdd">新建</ep-button>
    <ep-collapse v-model="activeNames" style="margin-top: 5px">
      <ep-collapse-item v-for="(item, index) in allData" :title="item.title" :index="index">
        <template slot="title">
          <ep-input v-model="item.title" style="width: 50%"></ep-input>
        </template>
        <div class="test">
          <!--          <div>{{item}}</div>-->
          {{ item.modifyTime }}
          <ep-input v-model="item.noteInfoJsonStr" type="textarea" style="margin: 5px 0 5px 0;"></ep-input>
          <ep-button @click="handleSave(item)"  type="text" style="color: #3c65c7">保存</ep-button>
          <ep-button @click="item.noteInfoJsonStr = ''" type="text" style="color: #eeaa22">清空</ep-button>
          <ep-button @click="handleDelete(item)" type="text" style="color: #e74c3c">删除</ep-button>
        </div>
      </ep-collapse-item>
    </ep-collapse>
  </div>
</template>

<script>
import { addNote, deleteNote, getAllNotes, saveNote } from '@/views/notePad/api'

export default {
  name: 'index',
  data() {
    return {
      allData: [],
      activeNames: []
    }
  },
  props: {
    jsonKey: ''
  },
  created() {
    this.refresh()
  },
  methods: {
    refresh() {
      getAllNotes().then(res => {
        console.log(res)
        this.allData = res.data
      })
    },
    buttonClick() {
      // this.sd.kkk='dddd'
      this.$set(this.sd, 'hello', 'dsddd')
      console.log(this.sd)
    },
    handleSave(item) {
      if (item.id) {
        saveNote(item).then(res => {
          console.log(res)
          this.$pop('success')
        })
      } else {
        addNote(item).then(res => {
          console.log(res)
          this.$pop('add success')
        })
      }
    },
    handleDelete(item) {
      let vm = this
      this.$confirm({
        word: '是否删除？',
        callback(errorInfo) {
          if (errorInfo) {
            deleteNote(item.id).then(res => {
              console.log(res)
              vm.$pop('删除成功')
              this.refresh()
            })
          }
        }
      })
    },
    closeAll() {
      this.activeNames = []
    },
    handleAdd() {
      this.allData.unshift({})
    }
  }
}
</script>

<style scoped></style>
